<template>
  <el-table :data="data" style="width: 100%">
    <el-table-column prop="name" label="课程名称" />
    <el-table-column prop="createdByName" label="授课教师" />
    <el-table-column prop="createdTime" label="创建时间">
      <template #default="{ row }">
        {{ row.createdTime }}
      </template>
    </el-table-column>
    <el-table-column label="课程资料">
      <template #default="{ row }">
        <div>{{ row.files?.[0].name }}</div>
      </template>
    </el-table-column>
    <el-table-column label="操作">
      <template #default="{ row }">
        <el-button type="primary" @click="viewSign(row.id)">
          查看签到列表
        </el-button>
        <el-button type="danger" @click="deleteCourse(row.id)">
          删除课程
        </el-button>
      </template>
    </el-table-column>
  </el-table>
  <!-- 签到列表弹窗 -->
  <el-dialog v-model="visible" title="签到列表" width="80%">
    <el-table :data="signs">
      <el-table-column prop="studentName" label="学生名称"></el-table-column>
      <el-table-column prop="des" label="作业内容"></el-table-column>
      <el-table-column label="作业文件">
        <template #default="{ row }">
          <el-button
            type="primary"
            @click="handleDownload(row.studentHomeworkFiles?.[0].fileUrl)"
            >点击下载</el-button
          >
        </template>
      </el-table-column>
      <el-table-column prop="createdTime" label="创建时间"></el-table-column>
      <el-table-column prop="reviserName" label="批改人名称"></el-table-column>
      <el-table-column prop="comments" label="评论内容"></el-table-column>
      <el-table-column prop="grades" label="成绩"></el-table-column>
    </el-table>
  </el-dialog>
</template>

<script lang="ts" setup>
import { ElMessage, ElMessageBox } from "element-plus";
import {
  deleteCourseById,
  getHomeworkListByCourseId,
} from "../../../api/modules/course";
import { downloadFile } from "../../../api/modules/file";
import { request } from "../../../utils/request";
import { getCourseList } from "../composables/useProject";
import { useUserStore } from "../../../store/user";

defineProps<{
  data: any[];
}>();

const visible = ref(false);
const signs = ref([]);
function viewSign(id) {
  console.log(id);
  request({
    fn: getHomeworkListByCourseId,
    params: [id],
    success(re) {
      visible.value = true;
      signs.value = re.data || [];
      console.log(signs.value, re);
    },
  });
}
const userStore = useUserStore();

function deleteCourse(id) {
  ElMessageBox.confirm("是否删除该课程", "提示", {
    cancelButtonText: "取消",
    confirmButtonText: "确定",
    type: "warning",
  }).then(() => {
    request({
      fn: deleteCourseById,
      params: [id],
      success(res) {
        ElMessage.success("删除成功");
        getCourseList(userStore.userInfo.value.id);
      },
    });
  });
}

function handleDownload(url) {
  downloadFile(url).then((res) => {
    const blob = new Blob([res as any]);
    const link = document.createElement("a");
    link.href = URL.createObjectURL(blob);
    link.download = url;
    link.click();
  });
}
</script>
